<!--
 * @Description: 资源管理---运维资源
 * @Author: 魏勇
 * @Date: 2020-03-09 15:36:26
 * @LastEditTime: 2020-03-31 18:16:32
 * @LastEditors: 魏勇
 -->
<template>
    <div class="addServerConfigForm">
        <div class="dynamicForm" style="padding: 0 15px;">
            <el-row class="form-row-list" v-show="itemObj.show!==false" :key="index" v-for="(itemObj,index) in items">
                <el-col :span="4">
                    <span>{{itemObj.label}}：</span>
                </el-col>
                <el-col :span="18">
                    <span>{{curRow[itemObj.id]}}</span>
                </el-col>
            </el-row>

            <el-row style="margin-top: 15px;">
                <div style="height:30px;line-height: 30px;border-bottom: 1px solid #dfdfdf;margin-bottom: 15px;">
                    <span style="color:#999;">配置内容</span>
                </div>
                <dynamicForm ref="dynamicForm"
                             :items="formItems"></dynamicForm>
            </el-row>
        </div>
    </div>
</template>

<script>
    import {dateFormat} from "@/utils/tool";
    import domainCols from '../data/domainCols';
    import dynamicForm from "@/views/devOpsResource/components/dynamicForm";


    export default {
        name: "configDetail",
        components: {
            dynamicForm
        },
        computed: {},
        props: {
            curRow: {
                type: Object, default: () => {
                }
            },
            formItems: {
                type: Array, default: () => {
                    return [
                        {
                            "productId": this.curRow["id"],
                            "name": "",
                            "type": "",
                            "code": "",
                            "enumContent": "",
                            "value": ""
                        }
                    ];
                }
            }
        },
        data: function () {
            return {
                items: domainCols,
                typeValue: '',
                typeOptions: [
                    {label: '普通输入类型', value: 1},
                    {label: '时间格式类型', value: 2},
                    {label: '下拉枚举类型', value: 3}
                ],
                dynamicItems: [
                    {
                        "productId": this.curRow["id"],
                        "name": "",
                        "type": "",
                        "code": "",
                        "enumContent": "",
                        "value": ""
                    }
                ]
            }
        },
        created() {

        },
        mounted() {
        },
        watch: {},
        methods: {
            //获取需要提交的数据
            getSubmitData() {
                return this.dynamicItems;
            },
            addRowCol() {
                this.dynamicItems.push({
                    "productId": this.curRow["id"],
                    "name": "",
                    "type": "",
                    "code": "",
                    "enumContent": "",
                    "value": ""
                });
            },
            delRowCol(index) {
                if (index === 0) {

                }
                this.dynamicItems.splice(index, 1)
            },
            changeVal() {
            },
        }
    };
</script>

<style lang="scss">
    .temp-table {
        .temp-header {
            width: 100%;
            overflow: hidden;
            border-bottom: 1px solid #dfdfdf;
        }
        .temp-body {
            width: 100%;
            overflow: hidden;
        }
        .left-cell {
            float: left;
            min-width: 60px;
            font-weight: 600;
            line-height: 33px;

            &.content {
                padding-right: 10px;
            }
        }
        .btnIcon {
            float: left;
            font-size: 16px;
            line-height: 30px;
            cursor: pointer;
            position: relative;
            top: 2px;
        }

        .span-btn {
            width: 50px;
            display: inline-block;
            margin-left: 5px;
            cursor: pointer;
        }
    }
</style>